<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>限时抢购</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <script type="text/javascript" src="../script/api.js"></script>
    <script type="text/javascript" src="../script/zepto.min.js"></script>
    <script type="text/javascript" src="../script/common.js"></script>
    <script type="text/javascript" src="../script/doT.min.js"></script>
    <style>
        #ulList .aui-list-item-media,#ulList .aui-list-item {
            padding: 0;
        }

        #ulList .aui-list-item-media {
            padding: .5rem;
            width: 6rem;
        }

        #ulList .aui-list-item-title {
            font-size: .6rem;
        }

        #ulList .aui-list-item-text1 {
            font-size: .6rem
        }

        #ulList .aui-list-item-text1 span {
            font-size: .8rem;
            color: red;
        }

        #ulList .aui-list-item-text2 {
            text-decoration: line-through;
            font-size: .5rem;
            color: #ccc;
        }

        #ulList .aui-list-item-text3 {
            font-size: .6rem;
            display: flex;
            text-align: center;
            align-items: center;
            justify-content: space-between;
        }

        #ulList .aui-list-item-text3 span {
            border-radius: 5px;
            padding: .25rem .5rem;
            background-color: red;
            color: #fff;
        }

        #ulList .aui-list-item-media img {
            width: 100%;
            height: 100%;
            border-radius: 5px;
        }
    </style>
</head>

<body>
    <div class="aui-content aui-margin-b-15">
        <ul class="aui-list aui-media-list" id="ulList">
            <!-- <li class="aui-list-item">
            <div class="aui-media-list-item-inner">
                <div class="aui-list-item-media">
                    <img src="../../image/demo1.png">
                </div>
                <div class="aui-list-item-inner">
                    <div class="aui-list-item-text">
                        <div class="aui-list-item-title">带有媒体的列表二</div>
                    </div>
                    <div class="aui-list-item-text1">
                        已抢<span>1000</span>件
                    </div>
                    <div class="aui-list-item-text2">
                        原价
                    </div>
                    <div class="aui-list-item-text3">
                        <div>券后</div>
                        <span>马上抢</span>
                    </div>
                </div>
            </div>
        </li> -->
        </ul>
    </div>
</body>
<script type="text/javascript">
    apiready = function() {
      var data = api.pageParam.data,
          hour_typeVal = api.pageParam.hour_typeVal,
          min_idVal = api.pageParam.min_idVal,
          renderLi = doT.template($api.text($api.byId('templateLimit')));
          //console.log(JSON.stringify(data))
          //$api.html($api.byId('ulList'), '');
          $api.append($api.byId('ulList'), renderLi(data));

          api.addEventListener({
              name: 'scrolltobottom',
              extra: {
                  threshold: 100 //设置距离底部多少距离时触发，默认值为0，数字类型
              }
          }, function (ret, err) {
              var urlTransform = window.urlTransformZGD(window.APIServerZGD.LimitTime, {
                hour_typeVal: hour_typeVal,
                min_idVal: min_idVal, //分
              })
              _Ajax(urlTransform, 'get', {}, 'json', function (ret) {
                  console.log(JSON.stringify(ret))
                  if (ret.code === 1) {
                      $api.append($api.byId('ulList'), renderLi(ret.data));
                      min_idVal = ret.min_id
                  } else {
                      console.log(JSON.stringify(ret.msg))
                  }
              });
              console.log(urlTransform)
          });
    };

    function goTodetails(data) {
        //console.log(JSON.stringify(data),data.itemtitle)
        api.openWin({
            name: 'limit_details',
            url: './limit_details.html',
            rect: {
                x: 0,
                y: 0,
                w: 'auto',
                h: 'auto'
            },
            pageParam: {
                data: data
            }
        });
    }
</script>
<script id="templateLimit" type="text/x-dot-template">
    {{ for (var key in it){ }}

    <li class="aui-list-item" onclick='goTodetails( {{= JSON.stringify( it[key] ) }} )' tapmode>
        <div class="aui-media-list-item-inner">
            <div class="aui-list-item-media">
                <img src={{= it[key][ 'itempic']+ '_500x500.jpg' }}>
            </div>
            <div class="aui-list-item-inner">
                <div class="aui-list-item-text">
                    {{= it[key]['shoptype'] == 'B' ? '<img src="../image/tmall.png" style="width:0.6rem;margin-right:5px;">':'<img src="../image/taobao.png" style="width:0.6rem;margin-right:5px;">' }}
                    <div class="aui-list-item-title">{{= it[key]['itemtitle'] }}</div>
                </div>
                <div class="aui-list-item-text1">
                    已抢<span>{{= it[key]['itemsale'] }}</span>件
                </div>
                <div class="aui-list-item-text2">
                    原价{{= it[key]['itemprice'] }}
                </div>
                <div class="aui-list-item-text3">
                    <div>券后{{= it[key]['itemendprice'] }}</div>
                    <span>马上抢</span>
                </div>
            </div>
        </div>
    </li>

    {{ } }}
</script>

</html>
